<template>
  <el-dialog
    title="文件上传"
    :visible.sync="visible"
    width="30%"
    @close="handleClose"
    :append-to-body="true"
    :before-close="handleClose"
  >
    <div class="upload-container">
      <el-upload
        class="upload-demo"
        action="//upload.yl1001.com/upload/files/save/"
        accept=".fpf,.PDF"
        name="Filedata"
        :file-list="fileList"
        :before-upload="handlebeforeUpload"
        :on-success="handleSuccess"
        :on-preview="handlePreview"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">请上传pdf文件，且不超过10m</div>
      </el-upload>
    </div>
  </el-dialog>
</template>

<script>
import { uploadCareerFile } from "@/api/index";
const Base64 = require("js-base64").Base64;
export default {
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    personId: {
      type: String,
      default: "",
    },
    consultantId: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      fileList: [],
      fileName: "",
    };
  },
  methods: {
    handleClose() {
      this.$emit("update:visible", false);
      this.$emit("refresh");
    },
    handlebeforeUpload(file) {
      console.log(file);
      if (!file.type.includes("pdf")) {
        this.$message.error("请上传pdf文件");
        return false;
      }
      if (file.size > 10 * 1024 * 1024) {
        this.$message.error("文件大小不能超过10M");
        return false;
      }
      this.fileName = file.name;
      return true;
    },
    handleSuccess(res) {
      if (res.status_code == 200) {
        const params = {
          personId: this.personId,
          consultantId: this.consultantId || "378735873857",
          fileUrl: res.data[0],
          fileName: this.fileName,
        };
        uploadCareerFile(params).then((res) => {
          if (res.code == 200) {
            this.$message.success("上传成功");
          } else {
            this.fileList.pop();
            this.$message.error(res.status_desc);
          }
        });
      }
    },
    handlePreview(file) {
      if (file) {
        const path = file.response.data[0];
        let lastUrl = "";
        if (path.indexOf("file=") != -1) {
          // 文件名
          const fileName = path.split("file=")[1];
          // 后缀名
          const suffix = fileName.substring(fileName.lastIndexOf(".") + 1);
          // 编码文件名（不含扩展名）, 去掉=号
          const encodeFileName = Base64.encode(
            fileName.substring(0, fileName.lastIndexOf(".") + 1)
          ).replace("=", "");
          lastUrl = encodeURIComponent(
            Base64.encode(
              path + "&fullfilename=" + encodeFileName + "." + suffix
            )
          );
        } else {
          lastUrl = encodeURIComponent(Base64.encode(path));
        }
        window.open(
          "http://wk.yl1001.com/preview/onlinePreview?url=" + lastUrl
        );
      }
    },
  },
};
</script>

<style lang="less" scoped>
.upload-container {
  display: flex;
  justify-content: center;
}
</style>
